inspector: Allow editing css node properties

This reuses the property editor infrastructure from the
property list pages. Good that css nodes are objects.

diff --git a/gtk/inspector/css-node-tree.c b/gtk/inspector/css-node-tree.c
index 6a2e1a9221d9e7a8432055786fb8ddf4c2a742a9..1c894e232d014ea452af1ced9a8ac3d04763a971 100644 (file)
--- a/gtk/inspector/css-node-tree.c
+++ b/gtk/inspector/css-node-tree.c
@@ -24,10 +24,12 @@
 #include <glib/gi18n-lib.h>
 
 #include "css-node-tree.h"
+#include "prop-editor.h"
 
 #include "gtktreemodelcssnode.h"
 #include "gtk/gtktreeview.h"
 #include "gtk/gtklabel.h"
+#include "gtk/gtkpopover.h"
 #include "gtk/gtkwidgetprivate.h"
 
 enum {
@@ -44,11 +46,57 @@ struct _GtkInspectorCssNodeTreePrivate
 {
   GtkWidget *tree_view;
   GtkTreeModel *model;
+  GtkTreeViewColumn *name_column;
+  GtkTreeViewColumn *id_column;
+  GtkTreeViewColumn *classes_column;
   GtkWidget *object_title;
 };
 
 G_DEFINE_TYPE_WITH_PRIVATE (GtkInspectorCssNodeTree, gtk_inspector_css_node_tree, GTK_TYPE_BOX)
 
+static void
+row_activated (GtkTreeView             *tv,
+               GtkTreePath             *path,
+               GtkTreeViewColumn       *col,
+               GtkInspectorCssNodeTree *cnt)
+{
+  GtkTreeIter iter;
+  GdkRectangle rect;
+  GtkWidget *editor;
+  GtkWidget *popover;
+  GtkCssNode *node;
+  const gchar *prop_name;
+
+  if (col == cnt->priv->name_column)
+    prop_name = "name";
+  else if (col == cnt->priv->id_column)
+    prop_name = "id";
+  else if (col == cnt->priv->classes_column)
+    prop_name = "classes";
+  else
+    return;
+
+  gtk_tree_model_get_iter (cnt->priv->model, &iter, path);
+  node = gtk_tree_model_css_node_get_node_from_iter (GTK_TREE_MODEL_CSS_NODE (cnt->priv->model), &iter);
+  gtk_tree_view_get_cell_area (tv, path, col, &rect);
+  gtk_tree_view_convert_bin_window_to_widget_coords (tv, rect.x, rect.y, &rect.x, &rect.y);
+
+  popover = gtk_popover_new (GTK_WIDGET (tv));
+  gtk_popover_set_pointing_to (GTK_POPOVER (popover), &rect);
+
+  editor = gtk_inspector_prop_editor_new (G_OBJECT (node), prop_name, FALSE);
+  gtk_widget_show (editor);
+
+  gtk_container_add (GTK_CONTAINER (popover), editor);
+
+  if (gtk_inspector_prop_editor_should_expand (GTK_INSPECTOR_PROP_EDITOR (editor)))
+    gtk_widget_set_vexpand (popover, TRUE);
+
+  gtk_widget_show (popover);
+
+  g_signal_connect (popover, "unmap", G_CALLBACK (gtk_widget_destroy), NULL);
+}
+
 static void
 gtk_inspector_css_node_tree_finalize (GObject *object)
 {
@@ -68,6 +116,11 @@ gtk_inspector_css_node_tree_class_init (GtkInspectorCssNodeTreeClass *klass)
   gtk_widget_class_set_template_from_resource (widget_class, "/org/gtk/libgtk/inspector/css-node-tree.ui");
   gtk_widget_class_bind_template_child_private (widget_class, GtkInspectorCssNodeTree, tree_view);
   gtk_widget_class_bind_template_child_private (widget_class, GtkInspectorCssNodeTree, object_title);
+  gtk_widget_class_bind_template_child_private (widget_class, GtkInspectorCssNodeTree, name_column);
+  gtk_widget_class_bind_template_child_private (widget_class, GtkInspectorCssNodeTree, id_column);
+  gtk_widget_class_bind_template_child_private (widget_class, GtkInspectorCssNodeTree, classes_column);
+
+  gtk_widget_class_bind_template_callback (widget_class, row_activated);
 }
 
 static int

diff --git a/gtk/inspector/css-node-tree.ui b/gtk/inspector/css-node-tree.ui
index d82ba15d2885f2dba475abeddac494a74ec239f3..019d9d3088e17464f18ffc802f20b22fbd8da89e 100644 (file)
--- a/gtk/inspector/css-node-tree.ui
+++ b/gtk/inspector/css-node-tree.ui
@@ -21,6 +21,7 @@
           <object class="GtkTreeView" id="tree_view">
             <property name="visible">True</property>
             <property name="enable-search">False</property>
+            <signal name="row-activated" handler="row_activated"/>
             <child>
               <object class="GtkTreeViewColumn">
                 <property name="resizable">True</property>
@@ -35,7 +36,7 @@
               </object>
             </child>
             <child>
-              <object class="GtkTreeViewColumn">
+              <object class="GtkTreeViewColumn" id="name_column">
                 <property name="resizable">True</property>
                 <property name="title" translatable="yes">Name</property>
                 <child>
@@ -48,7 +49,7 @@
               </object>
             </child>
             <child>
-              <object class="GtkTreeViewColumn">
+              <object class="GtkTreeViewColumn" id="id_column">
                 <property name="resizable">True</property>
                 <property name="title" translatable="yes">ID</property>
                 <child>
@@ -61,7 +62,7 @@
               </object>
             </child>
             <child>
-              <object class="GtkTreeViewColumn">
+              <object class="GtkTreeViewColumn" id="classes_column">
                 <property name="resizable">True</property>
                 <property name="title" translatable="yes">Classes</property>
                 <child>